<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Jquery 属性操作</title>
</head>
<body>
<div>
    --------------------------CSS类
$("").addClass(class|fn)
$("").removeClass([class|fn])

--------------------------属性
$("").attr();
$("").removeAttr();
$("").prop();
$("").removeProp();

--------------------------HTML代码/文本/值
$("").html([val|fn])
$("").text([val|fn])
$("").val([val|fn|arr])

---------------------------
$("#c1").css({"color":"red","fontSize":"35px"})
</div>
<div class="div1 c1">jquery 属性操作</div>
<div id="id1">文本一
    <p>ppppppppppp</p>
</div>

<input type="checkbox" >是否可见
<input type="checkbox" checked="checked">是否可见1

<div ></div>
<input  class="input" type="text" value="123">
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script>

    console.log($("div").hasClass('div1'));
    console.log($("div").attr("c1" ,'c2'));
    console.log($("div").hasClass('c1'));
    console.log($("div").hasClass('c2'));
    console.log("------------------");
    console.log($(":checkbox:first").attr("checked"));
    console.log($(":checkbox:last").attr("checked"));
    // console.log($("div").prop())
    console.log("-----------------------");

    console.log($("#id1").html());
    console.log($("#id1").text());
    console.log($("#id1").html("<h>BOB</h>"));
    console.log($("#id1").html())
    console.log("**************");
    // 固有属性val
    console.log($(".input").val())
</script>
</body>
</html>